<template>
    <view>
        <view class="video-box" v-for="(item,index) in video" :key="index">
            <video class="video"
                   custom-cache="false"
                   :id="'video'+index"
                   @click="videoPlay(index)"
                   :src="item.url"
                   controls="controls"
                    object-fit="cover"></video>
        </view>
    </view>
</template>

<script>
    export default{
        name:"Videobox",
        props:{
            "video":{ type:Array },
        },
        data(){
            return{
                play:true
            }
        },

        onShow(){

        },

        methods:{

            videoPlay(index){
                //let video = uni.createVideoContext("video"+index, this)
                var video= document.getElementById("video"+index);
                if (video.paused){
                    //开始播放
                    video.play()//开始播放
                    this.play = false
                }else{
                    video.pause()//暂停播放
                    this.play = true
                }
            }

        }

    }
</script>


<style lang="scss" scoped>
    image{width:100%; height:100%;}
    .video-box{ height: 500rpx; position: relative; margin-bottom:20rpx;
        .video{width: 100%;height: 100%;}
    }
</style>


